<template>
  <a-modal v-model:open="visible" title="确认强制关停" @close="onClose" @ok="submit">
    <a-form ref="formRef" :label-col="{ span: 5 }" :model="state.from" :rules="state.rules">
      <a-form-item label="强制关停原因" name="forcedShutdownReason">
        <a-input v-model:value="state.from.forcedShutdownReason" placeholder="强制关停原因" style="width: 100%" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script setup>
  import { reactive, ref } from 'vue';
  import { productionPlanApi } from '/@/api/business/product/order/production-plan-api.js';
  import { message } from 'ant-design-vue';

  const visible = ref(false);

  const emit = defineEmits(['reloadList']);

  const state = reactive({
    from: {
      planId: undefined,
      forcedShutdownReason: undefined,
    },
    rules: {
      forcedShutdownReason: [{ required: true, message: '强制关停原因 不能为空' }],
    },
  });

  function onClose() {
    visible.value = false;
    state.from.forcedShutdownReason = undefined;
  }

  function submit() {
    productionPlanApi.forcedShutdown(state.from.planId, state.from.forcedShutdownReason).then((res) => {
      emit('reloadList');
      message.success('操作成功');
      onClose();
    });
  }

  function show(record) {
    visible.value = true;
    state.from.planId = record.planId;
  }

  defineExpose({
    show,
  });
</script>

<style lang="less" scoped></style>
